<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
    div { visibility: hidden }
    div::before {
        content: "FAIL";
        visibility: visible;
    }
    .pass { visibility: visible }
    .pass::before { content: "PASS" }
</style>
<p>You should see the word PASS below.</p>
<div id="testElement"></div>
<script>
    test(() => {
        assert_equals(getComputedStyle(testElement, "::before").content, '"FAIL"', "Precondition.");
        testElement.className = "pass";
        assert_equals(getComputedStyle(testElement, "::before").content, '"PASS"', "::before content changed.");
    }, "Check that inherited property propagation does not skip pseudo element updates.");
</script>
